<template>
  <el-dialog
    :title="id ? '编辑绑定信息' :'绑定商户信息'"
    :close-on-click-modal="false"
    :visible.sync="visible"
    @closed="closeDialog"
    width="630px"
  >
    <el-form
      @submit.native.prevent
      class="dialog-form"
      :model="dataForm"
      :rules="dataRule"
      ref="dataForm"
      @keyup.enter.native="dataFormSubmit()"
      :label-width="this.$i18n.t('language') === 'English' ? '150px' : '80px'"
    >
      <el-form-item label="门店编号" label-width="150px">
        <div>{{ dataForm.shopCode }}</div>
      </el-form-item>
      <el-form-item label="门店名称" label-width="150px">
        <div>{{ dataForm.shopName }}</div>
      </el-form-item>
      <el-form-item label="小程序门店名称" label-width="150px">
        <div>{{ dataForm.shopAppName }}</div>
      </el-form-item>
      <el-form-item label="商户号" label-width="150px" prop="shopPayCode">
        <el-input
          size="small"
          maxlength="32"
          v-model.trim="dataForm.shopPayCode"
          style="width: 270px"
        ></el-input>
      </el-form-item>

      <el-form-item
        label="终端号"
        label-width="150px"
        prop="shopPayTerminalCode"
      >
        <el-input
          size="small"
          maxlength="32"
          v-model.trim="dataForm.shopPayTerminalCode"
          style="width: 270px"
        ></el-input>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <div class="default-btn" @click="visible = false">
        {{ $t("remindPop.cancel") }}
      </div>
      <div class="default-btn primary-btn" @click="dataFormSubmit()">
        {{ $t("remindPop.confirm") }}
      </div>
    </span>
  </el-dialog>
</template>

<script>
  import { deepCopy } from "@/utils";
  export default {
    props: {
      dataList: {
        type: Array,
        default: () => [],
      },
    },
    data() {
      var validateTitle = (rule, value, callback) => {
        if (String(value).trim() === "") {
          callback(new Error(this.$i18n.t("shop.tagNameNotNull")));
        } else {
          callback();
        }
      };
      return {
        visible: false,
        id: 0,
        dataForm: {
          name: "",
          parentId: 0,
          seq: 0,
        },
        isSubmit: false,
        dataRule: {
          shopPayTerminalCode: [
            {
              required: true,
              message: "支付终端号不能为空",
              trigger: "blur",
            },
            { validator: validateTitle, trigger: "blur" },
            {
              min: 2,
              max: 32,
              message: "支付终端号在2-32位之间",
              trigger: "blur",
            },
          ],
          shopPayCode: [
            {
              required: true,
              message: "支付商户号不能为空",
              trigger: "blur",
            },
            { validator: validateTitle, trigger: "blur" },
            {
              min: 8,
              max: 32,
              message: "支付商户号在8-32位之间",
              trigger: "blur",
            },
          ],
        },
      };
    },
    components: {},
    mounted() {},
    methods: {
      init(item) {
        this.id = !!item.shopPayCode
        this.dataForm = item;
        this.visible = true;
      },
      // 提交
      dataFormSubmit() {
        this.$refs["dataForm"].validate((valid) => {
          if (!valid) {
            return;
          }
          this.$http({
            url: this.$http.adornUrl(
              "/platform/shopDetail/finance/updateShopFinance"
            ),
            method: "post",
            data: this.$http.adornData({
              ...this.dataForm,
            }),
          }).then(() => {
            this.$message({
              message: this.$i18n.t("outlet.success"),
              type: "success",
            });
            this.visible = false;
            this.$emit("refreshChange");
          });
        });
      },
      // 选择分类改变时同步改变dataForm中数据
      handleChange(value) {
        if (value.length > 0) {
          this.dataForm.categoryId = value[value.length - 1];
        } else {
          this.dataForm.categoryId = 0;
        }
      },
      closeDialog() {
        this.$emit("refreshChange");
        this.$refs.dataForm.resetFields();
        this.id = 0;
      },
    },
  };
</script>

<style lang="scss" scoped></style>
